﻿/*!
 * TrippoApp v1.0
 * Copyright 2012 Trippo, Inc
 * Licensed under CC BY 3.0
 * http://creativecommons.org/licenses/by/3.0/
 *
 */

 
 
 /***** STRUCTURE *****/
 body { 
/*	background: url('../img/lined_paper.png') repeat-x repeat-y;*/
    margin: 0;
    padding: 0;
	background-color: #fff;
/*	FILTER: gray;*/
	background-attachment:fixed;/* 鍙栨秷鎶栧姩   */
	}
	
h1, h2 {
	text-shadow: white 0.02em 0.02em;
	font-family: "Helvetica Neue",Weiruan yahei, microsoft yahei, 'fangzheng', 'QlassikBold', sans-serif;
	}
	
h2 {
	font-size: 2.3em;
}
 
.content {
	padding-top:100px;
	font-size: 1.1em;
	line-height: 1.8em;
	}
	
.content p {
	font-size: 1.0em;
	line-height: 1.8em;
	margin-bottom: 1.1em;
	}
	

/***** BODY *****/
	
.page-title {
	padding: 100px 0 30px 0;
	}
	
.arrow-top img {
	margin: -7px 0 0 15px;
	}


	
/***** NAVIGATION BAR *****/

.navbar .brand {
	font-weight: bold;
	color: black;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .1), 0 0 30px rgba(255, 255, 255, .125);
	font-family: Weiruan yahei, microsoft yahei, 'fangzheng', 'QlassikBold', sans-serif;
}
.brand{
	color:white;
}


/***** HOMEPAGE *****/
	
#details {
	position: relative;
	float: right;
/* 	width: 527px; */
	width: auto;
	margin-top: 80px;
	padding-left: 20px;
}

#icon {
	position: relative;
	float: left;
	margin-top:-10px;
	margin-left: -6px;
	box-shadow:0 1px 0 rgba(255, 255, 255, .1);
}

#app-name {
	position: relative;
	float: left;
	margin-top: 20px;
	margin-right: 20px;
}

#app-name h1 {
	font-size: 5.5em;
	font-size: 5.5em;
	color: #ECECEC;
	text-shadow: -1px 0 #B3B3B3, 0 1px #B3B3B3, 1px 0 #B3B3B3, 0 -1px #B3B3B3, #020763 0.03em 0.03em;
	}
	
#version {
	top: 10px;
	position: relative;
	float: left;
}

#tagline {
	font-size: 1.4em;
	margin-top: 6.2em;
	clear: both;
}

#description {
	margin-top: 2em;
	margin-bottom: 1.8em;
}

#features li {
	background: url('../img/check.png') no-repeat left;
	list-style: none;
	padding-left: 25px;
	margin-left: -23px;
	line-height: 1.7em;
}

.download-box {
	width: 50%;
	float: left;
	padding-top: 20px;
/* 	padding-right: 5%; */
	font-size: 0.9em;
	line-height: 1.3em;
	}
	
	
	
/***** ABOUT PAGE *****/

.updates ul {
	list-style: none;
	padding-top: 10px;
	clear: both;
	margin: 0 0 25px 10px;
	}
	
.updates ul li {
	margin-bottom: 10px;
	}
	
.updates hr {
	border-top: 1px solid #CCC;
	}
	
.updates .label {
	display: block;
	float: left;
	margin-right: 10px;
}

.version {
	float:left;
	}

.release-date {
	float:right;
	margin-top: 4px;
	color: #999;
	font-size: 0.85em;
	}
	
.new {
  background-color: #3a87ad;
}

.fix {
	background-color: #468847;
	padding: 1px 8px 2px;
	}
	

	
/***** CONTACT *****/

#contact-form {
	border-left: 1px solid #cccccc;
	padding-left: 10px;
	}
	
#contact-info {
	padding-bottom:20px;
	padding-right: 20px;
	}
	
	
	
/***** FOOTER *****/

.footer {
	font-size: 0.85em;
	line-height: 1.5em;
	padding: 15px 0;
	border-top: 1px solid #CCC;
}

#copyright {
	clear:both;
	float:left;
	padding-top:20px;
	padding-left:10px;
	}
	
#credits {
	float:right;
	}
.mail_result{
	color:red;
	font-weight:bold;
}
.frdlinks div {
	clear:both;
	padding:15px;
}
.frdlinks div strong{
	float:left;
}
.frdlinks div ul{
	list-style:none;
}
.frdlinks div ul li{
/* 	width:100px; */
	width: auto;
	text-align:center;
	float:left;
}

/*****
edit
	width:907px;
	padding-left:78px;
*****/
.books {
/* width:907px; */
width: auto;
/*height:234px;*/
height:auto;
overflow:hidden;background:url(../img/book_bg.png) no-repeat;padding-left:75px;}
.books_tit {width:882px;height:33px;overflow:hidden;}
.books_tit dd {float:right;font-family:\5B8B\4F53;padding-top:8px;}
.books_con {width:830px;overflow:hidden;margin-top: -25px;}
.books_obj {width:860px;overflow:hidden;}
.books_box {padding:14px 0 0 9px;width:133px;overflow:hidden;float:left;position:relative;}
.books_box a {display:block;width:110px;height:140px;padding-bottom:7px; background:url(../img/index.png) 0 140px no-repeat;}
.books_box img {
	-webkit-border-radius:3px;
	 -khtml-border-radius:3px;
 	   -moz-border-radius:3px;
 		 -o-border-radius:3px;
 			border-radius:3px;}
.books_box span {display:block;width:62px;height:68px;overflow:hidden;position:absolute;top:14px; left:9px;}
.books_box span.new {background:url(../img/new.png) no-repeat;}
.books_box span.free {background:url(../img/free.png) no-repeat;}
.books_box span.soon {background:url(../img/soon.png) no-repeat;}
/********************
   璇勪环 Letter
********************/
.hot_right {
/*width:450px;*/
width: 35%;
overflow:hidden;float:right;}
.hot_ad {
/*width:320px;*/
width: 25%;
height:165px;
overflow:hidden;margin:5px;
	-webkit-box-shadow:0 0 6px #b2b2b2;
	 -khtml-box-shadow:0 0 6px #b2b2b2;
 	   -moz-box-shadow:0 0 6px #b2b2b2;
 		 -o-box-shadow:0 0 6px #b2b2b2;
 			box-shadow:0 0 6px #b2b2b2;
	/*
	-webkit-border-radius:3px;
	 -khtml-border-radius:3px;
 	   -moz-border-radius:3px;
 		 -o-border-radius:3px;
 			border-radius:3px;
	*/
	}
.hot_con {
/* width:430px; */
width: auto;
/* height:552px; */
height: 100%;
overflow:hidden;border:1px #ddd solid;margin:10px 5px 5px 5px;
	  border-radius:5px 5px 5px 5px;
	-webkit-box-shadow:0 0 6px #dbdbdb;
	 -khtml-box-shadow:0 0 6px #dbdbdb;
 	   -moz-box-shadow:0 0 6px #dbdbdb;
 		 -o-box-shadow:0 0 6px #dbdbdb;
 			box-shadow:0 0 6px #dbdbdb;}
.hot_write {
/* width:317px; */
width: 70%;
/* height:42px; */
height: auto;
overflow:hidden;}
.hot_write dt {float:left;
/* font-size:24px; */
font-size: 1.5em;
font-family:\5FAE\8F6F\96C5\9ED1;color:#ff4f05;padding:10px 10px 0 10px;}
.hot_write dd {float:right;padding:11px 9px 0 0;}
.hot_tag {
/* width:295px; */
width: 80%;
/* height:40px; */
height: auto;
overflow:hidden;padding-left:1em;}
.hot_tag ul {padding-left:1em;overflow:hidden;background:url(../img/hot_tag.png) left bottom repeat-x;}
.hot_tag li {
width:101px;
/*height:21px;*/
height: auto;
overflow:hidden;float:left;text-align:center;padding-top:1em;color:#4f565b; cursor:pointer;}
.hot_tag li.on {border-bottom:3px #3c434d solid;}
.hot_pro {
/* width:430px; */
width: 98%;
overflow:hidden;}
.hot_obj {
/* width:430px; */
width: 98%;
overflow:hidden;float:left;display:none;}
.hot_obj ul {
/* width:400px; */
width: 90%
overflow:hidden;padding-left:1em;}
/********************
edit
	padding:14px 0 0 33px;->18px 0 0 33px;
********************/
.hot_obj li {
/* width:365px; */
width: 90%;
/* height:90px; */
height: auto;
overflow:hidden;
position:relative;border-bottom:1px #d8d8d8 solid;padding:18px 10px 10px 33px;background:url(../img/line2.png) 18px 20px no-repeat;}
.hot_obj li.on {background:url(../img/line2_on.png) 18px 20px no-repeat;}
/*淇敼*/
.hot_obj li.on i {color: #59B8D8;}
.hot_obj li.on b {color:#56abde;}
.hot_obj i {display:block;
/* width:300px; */
width: 90%;
/* height:72px; */
height: auto;
overflow:hidden;line-height:2em;color:#777;}
.hot_obj b {color:#4f565b;}
.hot_obj span {position:absolute;right:0;bottom:1.25em;color:#bababa;}
/********************
edit
	height:20px->40px;
	padding:11px 0 0 27px;->21px 0 0 27px;
********************/
.hot_page {width:272px;height:40px;overflow:hidden;padding:21px 0 0 27px;}
.hot_page a,.hot_page a:visited {display:block;width:20px;height:17px;overflow:hidden;background:url(../img/index.png) -280px -70px no-repeat;float:left;font-weight:bold;text-align:center;color:#999;padding-top:3px;margin-right:4px;}
.hot_page a:hover {background-position:-250px -70px;}
.hot_page a.on {background-position:-250px -70px;}
.hot_page a.pghd {background-position:-250px -10px;margin-right:0;text-indent:-200px;}
.hot_page a.pged {background-position:-280px -10px;margin-right:0;text-indent:-200px;}
.hot_page a.pgup {background-position:-250px -40px;margin-right:0;text-indent:-200px;}
.hot_page a.pgdn {background-position:-280px -40px;margin-right:0;text-indent:-200px;}
/********************
PIN鐨刵ote渚跨
********************/
.right-col {
  float: left;
  width: 30%;
  padding-left: 20px;
}
.pin {
  position: absolute;
  top: -49px;
  right: -87px;
}
.note-container {
  margin-top:30px;
}
.note {
  padding: 10px 15px;
  background: #eee;
  text-decoration:none;
  background:#ffc;
  display:block;
  padding: 10px;
  width: 200px;        
  box-shadow: 5px 5px 7px rgba(33,33,33,.7);
  -webkit-transform: rotate(-15deg);
     -moz-transform: rotate(-15deg);
      -ms-transform: rotate(-15deg);
          transform: rotate(-15deg);
  font-size: 14px;
}
.note h3 {
  font-size: 28px;
  margin: 0;
}
